<template>
    <div class="home-box">
        <div class="list-name">
            <span>热门电影</span>
        </div>
        <!-- 电影列表 -->
        <!-- <div class="content-list">
                    <film-item v-for="(film,index) in films" :key="film.filmId" :film="film"></film-item>
                </div> -->

        <film-list class="content-list" :list="films"></film-list>

    </div>
</template>
<script>
    const Film = Vue.extend({
        template: document.currentScript.ownerDocument.querySelector("template"),
        data(){
            return{
                films: []
            }
        },
        methods: {
            loadFilms() {
                $.ajax({
                    url: "http://localhost/film-project/filmApi/loadFilms.php",
                    dataType: "json",
                    data: {
                        size: 11
                    },
                    success: ({ result }) => {
                        // console.log(result);
                        this.films = result;
                    }
                })
            }
        },
        mounted() {
            this.loadFilms();
        }
    })
</script>